<template>
	<div id="TranslateIndex" class="container">
		<h1>果然在线翻译</h1>
		<TranslateForm @passingEvents="translateText"></TranslateForm>
		<TranslateOutput v-text="translatedText"></TranslateOutput>
	</div>
</template>

<script>
	import TranslateForm from '@/components/TranslateForm'
	import TranslateOutput from '@/components/TranslateOutput'
export default {
	name: 'TranslateIndex',
	data:function() {
		return{
			translatedText:""
		}
	},
	components: {
		TranslateForm,TranslateOutput
	},
	methods:{
		translateText:function(receiveUserInputText,language){
			this.$http.get('https://translate.yandex.net/api/v1.5/tr.json/translate?key=trnsl.1.1.20180806T061500Z.c12ac11cbd88f038.0630dbfa3a45526977ee7ea57b9bba4d41c3baaa&lang='+language+'&text='+receiveUserInputText
			)
			.then((response)=>{
				//console.log(response.body.text[0]);
				this.translatedText = response.body.text[0];
			})
		}
	}
}
</script>

<style>
	
</style>
